<template>
  <div class="secret_content">
    <Tabs>
      <TabPane label="交易密钥管理">
        <Form :label-width="150">
          <Form-item label="RSA公钥:">
            <Input type="text" v-model="rsaKey" :disabled='rsaDisabled' style="width: 500px;"/>
          </Form-item>
          <Form-item>
            <Button type="primary" @click="modifyRsa">点击修改</Button>
            <Button v-if="saveRsaBtn" @click="saveRsa">保存修改</Button>
          </Form-item>
          <Form-item label="md5密钥:">
            <Input v-model="md5Key" :disabled='md5Disabled' style="width: 500px;"/>
            <span style="margin-left: 20px;color: red" v-if="tipShow">修改密钥过程会影响交易，建议在无交易时段修改密钥</span>
          </Form-item>
          <Form-item>
            <Button type="primary" @click="modifyMd5">点击修改</Button>
            <Button v-if="saveMd5Btn" @click="saveMd5">保存修改</Button>
          </Form-item>
        </Form>
      </TabPane>
    </Tabs>
    <Tabs>
      <TabPane label="通知密钥管理">
        <Form :label-width="150">
          <Form-item label="RSA公钥:">
            <Input type="textarea" v-model="platformRsaPublicKey" disabled="true" :autosize="{minRows: 2,maxRows: 5}" style="width: 500px;"/>
          </Form-item>
        </Form>
      </TabPane>
    </Tabs>
  </div>
</template>

<script type="text/ecmascript-6">
  import storage from '@/utils/helpers/storageLite'
  import Model from '@/models/apps'

  export default{
    name: 'SecretManager',
    data () {
      return {
        md5Disabled: true,
        rsaDisabled: true,
        md5Key: '',
        rsaKey: '',
        id: '',
        tipShow: false,
        saveMd5Btn: false,
        saveRsaBtn: false,
        platformRsaPublicKey: ''
      }
    },
    created () {
      this.init()
    },
    methods: {
      modifyRsa () {
        this.rsaDisabled = false
        this.saveRsaBtn = true
      },
      modifyMd5 () {
        this.tipShow = true
        this.saveMd5Btn = true
        this.md5Disabled = false
      },
      saveRsa () {
        if (this.rsaKey.length === 0) {
          this.$Message.error('请输入RSA公钥')
          return
        }
        new Model('userConfig')
          .PUT({
            params: {
              id: this.id,
              userRsaPublicKey: this.rsaKey
            }
          })
          .then((res) => {
            if (res.data.errorCode === '200') {
              this.$Message.success('修改成功')
              this.rsaDisabled = true
              this.saveRsaBtn = false
            } else {
              this.$Message.error('未知异常，请稍后再试！')
            }
          })
      },
      saveMd5 () {
        if (this.md5Key.length === 0) {
          this.$Message.error('请输入MD5密钥')
          return
        }
        new Model('userConfig')
          .PUT({
            params: {
              id: this.id,
              userMd5Key: this.md5Key
            }
          })
          .then((res) => {
            if (res.data.errorCode === '200') {
              this.$Message.success('修改成功')
              this.md5Disabled = true
              this.tipShow = false
              this.saveMd5Btn = false
            } else {
              this.$Message.error('未知异常，请稍后再试！')
            }
          })
      },
      init () {
        new Model('userConfig')
          .GET({
            params: {
              userNo: storage.get('userNo')
            }
          })
          .then((res) => {
            if (res.data.errorCode === '200') {
              this.md5Key = res.data.data.userMd5Key
              this.rsaKey = res.data.data.userRsaPublicKey
              this.platformRsaPublicKey = res.data.data.platformRsaPublicKey
              this.id = res.data.data.id
              if (this.rsaKey.length === 0) {
                this.rsaDisabled = false
              }
            }
          })
      }
    }
  }
</script>

<style>
  .secret_content {
    width: 1000px;
    margin: 40px auto;
  }
</style>
